{include file="common/header"/}
<style>
.layui-card{border: 1px solid #CCC;}
.p10{padding:10px 0;}
.mediasList .mediasImg{width:100%;position:relative;}
.mediasList .mediasImg [data-select="mediasImg"]{ width: 100%; height:100%; }
.mediasList .mediasImg .mediasTitle{position:absolute;left:0;right:0;bottom:0;height:25px; line-height:25px; padding:0px 10px; background:#000;color:#FFF;}
.article-add{ display:block; text-align:center;height:30px; line-height:30px; cursor:pointer; }
.mediasList .medias-item{ display:flex;  padding: 0px 10px;}
.mediasList .medias-item .medias-item-title{ flex:1}
.mediasList .medias-item .medias-item-img{ width: 60px; height:60px; }
.mediasList .medias-item .medias-item-img img{ width:100%;}
</style>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div class="layui-card">
        <div class="layui-card-body">
          <div class="layui-row">
              <form action="" class="layui-form">
                  <div class="layui-row layui-col-space10">
                    <div class="layui-col-md2 layui-col-xs4">
                      <select name="wx_id" id="wx_id">
                      {volist name="wechat" id="vo"}
                        <option value="{$vo.id}">{$vo.name}</option>
                      {/volist}
                      </select>
                    </div>
                    <div class="layui-col-md2 layui-col-xs4">
                      <input type="button" id="searchBtn" name="submit" class="layui-btn" value="搜索">
                    </div>
                  </div>
              </form>
          </div>
          <div class="layui-row" style="padding: 10px 0px;">
            <div class="layui-btn-group">
              <a href="javascript:;" class="layui-btn layui-btn-sm" onclick="open_frame('添加','{:url('add')}');"><i class="layui-icon layui-icon-add-circle"></i>{:lang('add')}图文</a>
            </div>
          </div>
          <div class="layui-row layui-col-space15">
          {volist name="lists" id="vo" key="key"}
            <div class="layui-col-md2 layui-col-sm4">
              <div style="position: absolute;right: 7.5px; top: 7.5px;z-index: 10">
                <div class="layui-btn-group">
                  <a href="{:url('edit')}?id={$vo.id}" class="layui-btn layui-btn-xs">编辑</a>
                  <a data-url="{:url('del')}?id={$vo.id}" class="layui-btn layui-btn-danger layui-btn-xs del-item">删除</a>
                </div>
              </div>
              <div class="layui-card">
                {volist name="vo.child" id="vo1" key="k"}
                  {if $Think.lang.$k == 1}
                  <div class="layui-card-body news-left">
                    <div class="mediasList active">
                      <div class="mediasImg">
                        <img data-select="mediasImg" src="{$vo1.image}" alt="">
                        <span class="mediasTitle" data-select="mediasTitle">{$vo1.title}</span>
                      </div>
                    </div>
                  </div>
                  {else}
                  <div class="mediasList p10">
                    <div class="medias-item">
                      <div class="medias-item-title"><div data-select="mediasTitle">{$vo1.title}</div></div>
                      <div class="medias-item-img"><img data-select="mediasImg" src="{$vo1.image}" alt=""></div></div>
                  </div>
                  {/if}
                  {/volist}
              </div>
            </div>
          {/volist}
          </div>
          {notempty name="paginator"}
          <div class="layui-row">
            <div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-10">{$paginator|raw}</div>
          </div>
          {/notempty}
        </div>
      </div>
    </div>
  </div>
</div>

{include file="common/footer"/}
<script>
$(function(){
  $('.del-item').click(function(){
    var url = $(this).attr('data-url');
    layer.confirm('确定要删除吗', function(index){
      $.ajax({
        url:url,
        dataType:"json", 
        type:"get",   
        success:function(res){
            if (res.code==1) {
                layer.msg(res.msg, {time: 1800, icon: 1}, function () {
                    window.location.href = res.url;
                });
            } else {
                layer.msg(res.msg, {time: 1800, icon: 2});
            }
        },
        error:function(){
            return layer.msg('获取失败');
        }
      });
    });
  })
})
</script>